<template>
	<view>
		<view class="courseFileShow">
			<course-video 
			:courseId="course.courseId" 
			:logtime="logtime"
			:magPage="magPage"
			:initialTime="initialTime" 
			v-if="tabVideostatus" 
			ref="courseVideo"></course-video>
			<view style="overflow: auto;" v-if="type === 'pdf'">
				<u-image width="80px" height="80px" src="../../../../static/img/file_pdf_mobile.png" style="margin: 22px auto;" @click="lookPdf"></u-image>
				<view style="color: #FFFFFF;margin: 0 auto;text-align: center;">点击图标查看文件</view>
			</view>
		</view>
		<view>
			<u-tabs :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
		</view>
		<u-line/>
		<course-intro v-if="current === 0" :courseIntroRemark="course.remarks"></course-intro>
		<course-logs :courseId="course.courseId" :ResourceList="ResourceList" :studying="studying" v-if="current === 1" @value-change="resourceIdValue"></course-logs>
		<resource-discuss v-if="current === 2" :resourceId="logtime.resourceId"></resource-discuss>
	</view>
</template>

<script>
	import {
	    KmsResourceList,
		kmsCourseFileStudy,
		KmsLastStudied
	} from '@/api/kms/course.js';
	import CourseVideo from './displayContent/video.vue'
	import CourseLogs from './courseLogs.vue'
	import CourseIntro from './courseIntro.vue'
	import ResourceDiscuss from './resourceDiscuss.vue'
	export default {
		data() {
			return {
				scrollTop: 0,
				fileUrl: '/upload/20200821/close.png',
				ResourceList: [],
				resourceId: 0,
				Id: '',
				label: 102,
				list: [{
					name: '简介'
				}, {
					name: '目录'
				}, {
					name: '评论'
				}],
				current: 1,
				type: 'pdf',
				logtime: {},
				initialTime: 0,
				// 正在学习的资源
				studying: 0,
				// 切换视频的状态
				tabVideostatus: false,
				course:{},
				// 从我的消息模块过来
				magPage:false
			}
		},
		computed:{},
		onLoad(option) {
			this.Id = option.courseId
			this.label = option.label
			this.magPage = Boolean(option.magPage)
			if(this.magPage){
				this.current = 2
				this.logtime.resourceId = option.courseId 
			}
			console.log(option)
			this.getResourceList(true)
		},
		onShow() {
		},
		components: {
		  CourseVideo,
		   CourseLogs,
		  CourseIntro,
		ResourceDiscuss
		},
		watch:{},
		methods:{
			change(index) {
				this.current = index;
			},
			resourceIdValue(data){
				this.getResourceList()
				this.tabVideostatus = false
				this.label = 102
				this.resourceId = data.resourceId
				this.course.courseId = data.courseId
				this.Id = data.courseId
				this.type = data.type
				this.logtime = data.logtime
				this.studying  = data.logtime.fileId
				this.magPage = false
				if(this.type !='pdf'){
					this.getLastTime()
				}
			},
			getResourceList(first) {//获取资源的列表目录
			    let self = this;
			    let params = {
			        id:this.Id,
					label:this.label
			    }
			    KmsResourceList(params).then(res => {
					console.log('---->>>> ');
					console.log(res);
					self.ResourceList = res.data.list
					self.course = res.data.course
					if(first){
						self.logtime = res.data.list[0].files[0]
						self.studying = res.data.list[0].files[0].fileId
						self.type =res.data.list[0].files[0].path.substring(res.data.list[0].files[0].path.lastIndexOf(".")+1);
						self.getLastTime()
					}
					if(this.type == 'pdf'){
						this.lookPdf()
					}else{
						self.tabVideostatus = true
					}
			    })
			},
			getLastTime(){
				let self = this;
				let params = {
				    courseId: this.course.courseId,
					fileId: this.logtime.fileId
				}
				KmsLastStudied(params).then(res => {
					self.initialTime = res.data.studiedToSeconds
					// self.videoContext.seek(res.data.studiedToSeconds)
				})
			},
			lookPdf(){//查看pdf文件
				uni.navigateTo({
					url: '/pages/kmsManagement/kmsFunList/course/displayContent/file?courseId=' + this.course.courseId + '&fileId=' + this.logtime.fileId+ '&path=' + this.logtime.path,
				});
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		}
	}
</script>

<style lang="scss" scoped>
	.courseFileShow{
		width: 100%;
		height: 200px;
		border-bottom: 1px solid #E4E7ED;
		background-color: #000000;
	}
</style>
